<!DOCTYPE html>
<html>
<head>
    <:include file="../common/css.html" title="司机管理"/>
</head>
<body>
<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card card-box-shadow">
    	<div class="layui-card-body">
    	    <!-- 表格工具栏 -->
	        <form class="layui-form toolbar" lay-filter="driverTbSearchForm">
	            <div class="layui-form-item">
	                <div class="layui-inline">
	                    <label class="layui-form-label w-auto">名称：</label>
	                    <div class="layui-input-inline mr0">
	                        <input name="name" class="layui-input search_key" type="search" placeholder="名称"/>
	                    </div>
	                </div>
	                <div class="layui-inline">
	                    <button class="layui-btn icon-btn" lay-filter="driverTbSearch" id="driverTbSearch" lay-submit>
	                        <i class="layui-icon">&#xe615;</i>搜索
	                    </button>
	                </div>
	            </div>
	        </form>
	        <!-- 数据表格 -->
        	<table id="driverTable" lay-filter="driverTable"></table>
        </div>
    </div>
</div>
<!-- 表格操作列 -->
<script type="text/html" id="driverTbBar">
	<% if(so.hasPermission("orderB:driver:update")){ %>
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
    <% } %>
    <% if(so.hasPermission("orderB:driver:remove")){ %>
    <a class="layui-btn layui-btn-danger layui-btn-xs"
       data-dropdown="#driverTbDelDrop{{d.LAY_INDEX}}" no-shade="true">删除</a>
    <% } %>
    <div class="dropdown-menu-nav dropdown-popconfirm dropdown-top-right layui-hide"
         id="driverTbDelDrop{{d.LAY_INDEX}}"
         style="max-width: 200px;white-space: normal;min-width: auto;margin-left: 10px;">
        <div class="dropdown-anchor"></div>
        <div class="dropdown-popconfirm-title">
            <i class="layui-icon layui-icon-help"></i>
            确定要删除{{d.name}}吗？
        </div>
        <div class="dropdown-popconfirm-btn">
            <a class="layui-btn" btn-cancel>取消</a>
            <a class="layui-btn layui-btn-normal" lay-event="del">确定</a>
        </div>
    </div>
</script>
<!-- 表单弹窗 -->
<script type="text/html" id="driverEditDialog">
    <form id="driverEditForm" lay-filter="driverEditForm" class="layui-form model-form">
        <input name="id" id="id" type="hidden"/>
        <input name="companyId" type="hidden"/>
        <div class="layui-form-item layui-row">
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">车队</label>
                <div class="layui-input-block">
                   <input id="carTeam" name="carTeam" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入车队"/>
                </div>
            </div>
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">姓名</label>
                <div class="layui-input-block">
                   <input id="name" name="name" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入姓名"/>
                </div>
            </div>
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">车牌</label>
                <div class="layui-input-block">
                   <input id="carNo" name="carNo" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入车牌"/>
                </div>
            </div>
        </div>
        <div class="layui-form-item layui-row">
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">行驶证以及对应图片</label>
                <div class="layui-input-block">
                   <input id="vehicleLicense" name="vehicleLicense" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入行驶证以及对应图片"/>
                </div>
            </div>
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">驾驶证以及对应图片</label>
                <div class="layui-input-block">
                   <input id="driveLicense" name="driveLicense" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入驾驶证以及对应图片"/>
                </div>
            </div>
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">挂靠公司营业执照以及对应图片</label>
                <div class="layui-input-block">
                   <input id="corporationLicensePic" name="corporationLicensePic" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入挂靠公司营业执照以及对应图片"/>
                </div>
            </div>
        </div>
        <div class="layui-form-item layui-row">
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">银行名称</label>
                <div class="layui-input-block">
                   <input id="bankName" name="bankName" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入银行名称"/>
                </div>
            </div>
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">银行卡卡号</label>
                <div class="layui-input-block">
                   <input id="bankNo" name="bankNo" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入银行卡卡号"/>
                </div>
            </div>
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">审核状态: 已审核,未审核,审核未通过</label>
                <div class="layui-input-block">
                   <input id="state" name="state" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="" placeholder="请输入审核状态: 已审核,未审核,审核未通过"/>
                </div>
            </div>
        </div>
        <div class="layui-form-item layui-row">
            <div class="layui-col-md4">
                <label class="layui-form-label layui-form-required">排序</label>
                <div class="layui-input-block">
                   <input id="orderNum" name="orderNum" type="text" class="layui-input" autocomplete="off"
                   lay-verType="tips" lay-verify="numberX" placeholder="请输入排序"/>
                </div>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn" lay-filter="driverEditSubmit" lay-submit>保存</button>
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        </div>
    </form>
</script>

<!-- js部分 -->
<:include file="../common/js.html"/>
<script type="text/javascript">
layui.use(['layer', 'form', 'table', 'tableX', 'util', 'admin','xmSelect','formX','dropdown','laydate'], function () {
let $ = layui.jquery;
let layer = layui.layer;
let form = layui.form;
let table = layui.table;
let tableX = layui.tableX;
let util = layui.util;
let admin = layui.admin;
let formX = layui.formX;
let xmSelect = layui.xmSelect;
let laydate = layui.laydate;

// 渲染表格
let insTb = tableX.render({
    elem: '#driverTable'
    ,url: 'driver/page'
    ,page: true
    ,height: 'full-100'
    ,toolbar: ['<p>',
        <% if(so.hasPermission("orderB:driver:save")){ %>
        '<button lay-event="add" class="layui-btn layui-btn-sm icon-btn"><i class="layui-icon">&#xe654;</i>添加</button>&nbsp;',
        <% } %>
        <% if(so.hasPermission("orderB:driver:remove")){ %>
        '<button lay-event="del" class="layui-btn layui-btn-sm layui-btn-danger icon-btn"><i class="layui-icon">&#xe640;</i>删除</button>',
        <% } %>
        '</p>'].join('')
    ,cellMinWidth: 100
    ,cols: [[
        {type: 'checkbox'}
        ,{type: 'numbers'}
        ,{field: "carTeam",  title: "车队", sort: true, hide:false }
        ,{field: "name",  title: "姓名", sort: true, hide:false }
        ,{field: "carNo",  title: "车牌", sort: true, hide:false }
        ,{field: "vehicleLicense",  title: "行驶证以及对应图片", sort: true, hide:false }
        ,{field: "driveLicense",  title: "驾驶证以及对应图片", sort: true, hide:true }
        ,{field: "corporationLicensePic",  title: "挂靠公司营业执照以及对应图片", sort: true, hide:true }
        ,{field: "bankName",  title: "银行名称", sort: true, hide:true }
        ,{field: "bankNo",  title: "银行卡卡号", sort: true, hide:true }
        ,{field: "state",  title: "审核状态: 已审核,未审核,审核未通过", sort: true, hide:true }
        ,{field: "orderNum",  title: "排序", sort: true, hide:true }
        ,{field: "createTime",  title: "创建时间", sort: true, hide:true ,templet: function (d) {
                return util.toDateString(d.createTime);
            }
        }
        ,{field: "createUser",  title: "创建人", sort: true, hide:true }
        ,{field: "updateTime",  title: "更新时间", sort: true, hide:true ,templet: function (d) {
                return util.toDateString(d.createTime);
            }
        }
        ,{field: "updateUser",  title: "更新人", sort: true, hide:true }
        ,{field: "deleted",  title: "del(0正常 1删除)", sort: true, hide:true }
        ,{title: '操作', toolbar: '#driverTbBar', align: 'center', minWidth: 200, fixed: 'right'}
    ]]
});

//监听行双击
table.on('rowDouble(driverTable)', function(obj){
    let data = obj.data;
    showEditModel(data);
    // obj.tr.find("a[lay-event=edit]").trigger("click");//会跳出来两个一样的框 这个不好用
    //obj.tr.toggleClass('layui-table-click').siblings().removeClass('layui-table-click');//选中行
});


// 搜索
form.on('submit(driverTbSearch)', function (data) {
    insTb.reload({where: data.field, page: {curr: 1}});
    return false;
});

$('.search_key').bind('keypress',function(event){
    if(event.keyCode == "13")
    {
        $("#driverTbSearch").click();
    }
});

// 工具条点击事件
table.on('tool(driverTable)', function (obj) {
    if ('edit' === obj.event) { // 修改
        showEditModel(obj.data);
    } else if ('del' === obj.event) { // 删除
        doDel(obj);
    }
});

/* 表格头工具栏点击事件 */
table.on('toolbar(driverTable)', function (obj) {
    if ('add' === obj.event) { // 添加
        showEditModel();
    } else if ('del' === obj.event) { // 删除
        let checkRows = table.checkStatus('driverTable');
        if (!checkRows || !checkRows.data || 0 === checkRows.data.length) {
            return layer.msg('请选择要删除的数据', {icon: 2, anim: 6});
        }
        let ids = checkRows.data.map(function (d) {
            return d.id;
        });
        doDel({ids: ids});
    }
});


// 显示编辑弹窗
function showEditModel(mData) {
    admin.open({
        type: 1,
        title: (mData ? '修改' : '添加') + '司机管理',
        maxmin:true,
        closeBtn:1,
        resize: true,
        shade: [0.8, "#393D49"],
        shadeClose:true,
        area:["900px","500px"],
        content: $('#driverEditDialog').html(),
        success: function (layero, dIndex) {
            // 回显表单数据
            form.val('driverEditForm', mData);
            // 表单提交事件
            form.on('submit(driverEditSubmit)', function (data) {
                let loadIndex = layer.load(2);
                admin.req(mData ? 'driver/update' : 'driver/save', data.field, function (res) {
                    layer.close(loadIndex);
                    if (0 === res.code) {
                         layer.close(dIndex);
                        layer.msg(res.msg, {icon: 1});
                        insTb.reload({page: {curr: 1}});
                    } else {
                        layer.msg(res.msg, {icon: 2, anim: 6});
                    }
                }, 'post');
                $("button[lay-filter='driverEditSubmit']").attr("disabled","disabled");
                setTimeout(function(){$("button[lay-filter='driverEditSubmit']").removeAttr("disabled");}, 1000 );
                return false;
            });
            // 禁止弹窗出现滚动条
            //$(layero).children('.layui-layer-content').css('overflow', 'visible');
        }
    });
}

// 删除
function doDel(obj) {
    if (obj.ids) {  // 批量删除
        admin.confirm('确定要删除选中数据吗？', function (i) {
            layer.close(i);
            let loadIndex = layer.load(2);
            admin.req('driver/removeBatch', JSON.stringify(obj.ids), function (res) {
                layer.close(loadIndex);
                if (0 === res.code) {
                    layer.msg(res.msg, {icon: 1});
                    insTb.reload({page: {curr: 1}});
                } else {
                    layer.msg(res.msg, {icon: 2, anim: 6});
                }
            }, 'post');
        });
    } else {  // 单个删除
         let loadIndex = layer.load(2);
         $.get('driver/remove', {id: obj.data.id}, function (res) {
             layer.close(loadIndex);
             if (0 === res.code) {
                 layer.msg(res.msg, {icon: 1});
                 insTb.reload({page: {curr: 1}});
             } else {
                 layer.msg(res.msg, {icon: 2, anim: 6});
             }
         });
     }
}
});
</script>
</body>
</html>
